:host {
  @apply relative;

  &.full-screen {
    @apply absolute top-0 left-0 right-0 bottom-0 m-0 z-20;

    .answer-container {
      @apply items-stretch;
      .answer-content {
        @apply overflow-x-hidden overflow-y-auto;
        .answer-component {
          @apply overflow-hidden min-h-[400px];
        }
      }
      .ngm-analytical-card, .ngm-analytical-grid {
        @apply h-full;
      }
    }
  }
}

.text-color {
  @apply text-zinc-700 dark:text-zinc-300;
}

.ngm-fullscreen-button.mat-mdc-icon-button {
  @apply absolute right-4 top-4;
}

:host::ng-deep {
  .ngm-analytical-card {
    .ngm-card-header {
      @apply flex-wrap;
    }
  }
  .ngm-kpi--kpi {
    .ngm-kpi--title {
      @apply text-xl;
    }
    .ngm-kpi--value {
      font-size: 3rem;
      line-height: 1.5;
    }
  }
}
